<!DOCTYPE html>
<html>

<head>
	<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" />
	<meta http-equiv="Pragma" content="no-cache" />
	<meta http-equiv="Expires" content="0" />
	<meta charset="UTF-8">
	<meta charset="utf-8" name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no"
	/>
	<title>车主认证</title>
	<link rel="stylesheet" href="http://carowner.yonyouauto.com/fs01/ase/v1/components/bootstrap/dist/css/bootstrap.min.css">
	<script src="http://carowner.yonyouauto.com/fs01/ase/v1/components/jquery2.1.1/jquery.min.js"></script>
	<script type="text/javascript" src="http://carowner.yonyouauto.com/fs01/ase/v1/js/common/py.js"></script>
	<script type="text/javascript" src="http://carowner.yonyouauto.com/fs01/ase/v1/components/bootstrap/dist/js/bootstrap.min.js"></script>

	<script type="text/javascript" src="http://carowner.yonyouauto.com/fs01/ase/v1/components/hammer/hammer.min.js"></script>
	<script type="text/javascript" src="http://carowner.yonyouauto.com/fs01/ase/v1/components/hammer/jquery.hammer.js"></script>

	<script type="text/javascript" src="http://carowner.yonyouauto.com/fs01/ase/v1/js/common/common.js?_t=8392912212238"></script>
	<script type="text/javascript" src="http://carowner.yonyouauto.com/fs01/ase/v1/js/layer/layer.js"></script>
	<script type="text/javascript" src="http://carowner.yonyouauto.com/fs01/ase/v1/js/common/wechatCommon.js"></script>
	<script type="text/javascript" src="../../js/homepage/gmcc.authentication.js?_t=21328123"></script>
	<script type="text/javascript" src="https://api.map.baidu.com/api?v=2.0&ak=6WLRtwjdIPrXW5FaNIsgdZG038pLb84Z"></script>
	<style>
		a {
			text-decoration: none;
			color: #000;
		}

		.product-head h1 {
			font-size: 14px;
			font-family: Arial, Helvetica, sans-serif;
			margin-bottom: 3px;
			margin-left: 3px;
		}

		.product-head {
			font-size: 12px;
			padding: 4px;
			background-color: #ccc;
			width: 235px;
		}

		.filterform input {
			font-size: 15px;
			padding: 3px;
			border: 1px solid #999;
		}

		li {
			padding: 0;
			margin: 3px;
			list-style: none;
			width: 100%;
		}

		li a {
			color: #000;
			font-family: Arial, Helvetica, sans-serif;
			font-size: 11px
		}

		ul {
			margin: 0;
			padding: 0;
		}

		.clear {
			clear: both;
		}

		body {
			background-color: #f6f6f6;
		}

		input#engineNo:focus {
			outline: none;
		}

		input#vin:focus {
			outline: none;
		}


		.hide-div {
			display: none;
		}

		.btnbtn {
			background-color: #E80000;
			color: #fff;
			width: 100%;
			height: 45px;
			border-style: none;
			border-width: 0;
			border-radius: 5px;
		}

		.btnbtn1 {
			background-color: #999;
			color: #fff;
			width: 100%;
			height: 45px;
			border-style: none;
			border-width: 0;
			border-radius: 5px;
			font-size: 18px
		}
	</style>

</head>

<body>
	<input class="hidden" id="userId">
	<input class="hidden" id="dealerCode">
	<input type="hidden" id="salesConsultantId" name="salesConsultantId" value="">
	<input type="hidden" id="salesConsultantPhone" name="salesConsultantPhone" value="">
	<!-- 定位 -->
	<input class="hidden" id="regionName" name="regionName" value="">
	<input class="hidden" id="latitude" name="latitude" value="">
	<input class="hidden" id="longitude" name="longitude" value="">
	<div id="allmap"></div>
	<script type="text/javascript">

		$(function () {

			var rootPath = getRootPath();

			var result = getCookie("WECHAT_USER_OPENID");
			var result2 = getCookie("WECHAT_USER_USERID");
			if (result == null) {
				setCookie("WECHAT_USER_OPENID", openId);
			}
			if (result2 == null) {
				setCookie("WECHAT_USER_USERID", userId);
			}

			$.ajax({
				headers: { 'Cookie': document.cookie },
				type: "GET",
				url: rootPath + "/customer/api/v1/queryUserOwner2",
				//url : "http://localhost:9099/customer/api/v1/queryUserOwner",
				dataType: "json",
				contentType: "application/json",
				success: function (data) {
					console.log(data);
					if (data && data.length) {
						alert("您已是认证车主!");
						window.location.replace(rootPath + "/pub/personal?random=" + parseInt(10000 * Math.random())+(result?"&openId="+result:"")+(result2?"&userId="+result2:""));
					}
				}, error: function (data) {

				}
			});
		});

		$("#allmap").hide();



		var map = new BMap.Map("allmap");
		var point = new BMap.Point(116.709684, 39.89778);
		map.centerAndZoom(point, 16);
		map.enableScrollWheelZoom();

		var myIcon = new BMap.Icon("myicon.png", new BMap.Size(30, 30), {
			anchor: new BMap.Size(10, 10)
		});

		var marker = new BMap.Marker(point, {
			icon: myIcon
		});
		map.addOverlay(marker);

		var geolocation = new BMap.Geolocation();
		geolocation.getCurrentPosition(function (r) {
			if (this.getStatus() == BMAP_STATUS_SUCCESS) {
				var mk = new BMap.Marker(r.point);
				map.addOverlay(mk);
				//map.panTo(r.point);//地图中心点移到当前位置
				var latCurrent = r.point.lat;
				var lngCurrent = r.point.lng;
				//alert('我的位置：' + latCurrent + ',' + lngCurrent);
				$("#latitude").val(latCurrent);
				$("#longitude").val(lngCurrent);
				//根据经纬度查城市名
				getAddress(lngCurrent, latCurrent);
				//location.href="http://api.map.baidu.com/direction?origin="+latCurrent+","+lngCurrent+"&destination=39.89778,116.709684&mode=driving&region=北京&output=html";

			} else {
				//alert('failed' + this.getStatus());
			}
		}, {
				enableHighAccuracy: true
			})

		map.addOverlay(marker);
		var licontent = "";
		var opts = {
			width: 200,
			height: 80,
		};
		var infoWindow = new BMap.InfoWindow(licontent, opts);
		marker.openInfoWindow(infoWindow);
		marker.addEventListener('click', function () {
			marker.openInfoWindow(infoWindow);
		});

		function getAddress(longitude, latitude) {

			var address;

			//通过baiduMap API获取街道名称
			var map = new BMap.Map("allmap");
			var point = new BMap.Point(longitude, latitude);
			var gc = new BMap.Geocoder();

			gc.getLocation(point, function (rs) {

				var addComp = rs.addressComponents;

				address = addComp.province + ", " + addComp.city + ", "
					+ addComp.district + ", " + addComp.street + ", "
					+ addComp.streetNumber;

				//alert(addComp.city);
				$("#sou").attr('placeholder', "当前城市为：" + addComp.city);
				$("#regionName").val(addComp.city);
			});
			return address;
		}
	</script>
	<!-- 定位End -->
	<!--<img id="headImg" src="http://carowner.yonyouauto.com/fs01/ase/v1/images/GQ/d6.png" style="width:100%;">-->
	<div id="level1" class="container">
		<br>
		<button type="button" class="btn btn-danger btnbtn" style="background:#3790f3;" onclick="gmcc.addCarInfo()">
			<img style="width:8%;" src="http://carowner.yonyouauto.com/fs01/ase/v1/images/GQ/bc.png">&nbsp;&nbsp;&nbsp;添加车辆信息</button>
		<a style="padding:10px 0 0 0;float:right;" href="../hpp.html">以后再说</a>
	</div>

	<div id="level2" class="hide-div">
		<!--<h4 style="margin-left: 15px;"></h4>-->
		<div style="width: 100%; background-color: #FFFFFF; padding-top: 15px; padding-bottom: 15px; margin-bottom: 20px;">
			<div style="width: 100%; height: 50px; border-bottom: 1px solid #e5e5e5; padding-left: 15px;padding-bottom:2px;">
				<span style="width: 30%; float: left; line-height: 47px;">车架号(VIN)</span>
				<input id="vin" type="text" style="width: 70%;height:95%; line-height: 45px;border: 0;" placeholder="请输入车架号后6位">
				<!--  onblur="if(/[^0-9a-zA-Z]/g.test(value))alert('车架号格式不正确')" -->
			</div>
			<div style="width: 100%; height: 50px; border-bottom: 1px solid #e5e5e5; padding-left: 15px;">
				<div style="width:100%;height:100%;line-height: 47px;">
					<span style="width: 30%;float: left;">发动机号</span>
					<input id="engineNo" type="text" style="width: 70%; height:95%; line-height: 45px;border: 0;" placeholder="请输入发动机号后4位">
				</div>
				<div style="color:#E80000;font-size: 10px;">
					<!--<span>*进口三菱欧蓝德，请输入行驶证上发动机号的第3位到第6位</span>-->
				</div>
			</div>
			<br>

			<img src="http://carowner.yonyouauto.com/fs01/ase/v1/images/drivinglicense.png" class="img-responsive" style="text-align: center; padding-left: 60px; padding-right: 60px;">

			<div style="width: 100%; height: 50px; border-bottom: 1px solid #e5e5e5; padding-left: 15px;padding-bottom:2px;" id="inputShow">
				<span style="width: 30%; float: left; line-height: 47px;">验证码</span>
				<input id="imgValidate" type="text" style="width: 70%;height:95%; line-height: 45px;border: 0;" placeholder="请输入4位验证码">

			</div>
			<div style="text-align:center;padding-top:5px;" id="imgShow">
				<canvas id="canvas" width="120" height="45"></canvas>
				<span id="changeImg" ">看不清，换一张</span>
        </div>


</div>

<div style="margin-left: 15px; margin-right: 15px; ">
<button id="next " type="button " style="background-color: #3790f3; color: #fff; height: 45px; border-style: none; border-width:
				 0; border-radius: 5px; width: 100%; " onclick="gmcc.next() ">下一步</button></div>



</div>




<div id="level3 " class="hide-div ">
<h4 style="padding:0 0 0 10px ">已为您匹配首选销售服务店</h4>
	<div class="list-group ">
			<div class="form-group has-feedback list-group-item ">
				<!-- <label for="maintainType " class="col-sm-2 control-label ">经销商名称</label> -->
					<a id=" " class=" " href="# ">
				<div class="col-sm-10 list-group-item-text ">
					<img src="http://carowner.yonyouauto.com/fs01/ase/v1/images/GQ/1.png " style="width:7%; ">&nbsp;&nbsp;&nbsp;
					<span id="dealerName "></span>
				</div>
					</a>
			</div>
			<div class="form-group has-feedback list-group-item " style="vertical-align:middle; ">
				<!-- <label for="maintainType " class="col-sm-2 control-label ">经销商地址</label> -->
					<a id=" " class=" " href="# " onclick="gmcc.selectNowDealer(this) ">
				<div class="col-sm-10 list-group-item-text ">
					<img src="http://carowner.yonyouauto.com/fs01/ase/v1/images/GQ/2.png " style="vertical-align:middle;width:7%; ">&nbsp;&nbsp;&nbsp;
					<span id="detailAddress " style="vertical-align:middle;display:inline-block;width:60%;color:#7a7a7a; "></span>
					<span style="display:inline-block;vertical-align:middle;text-align:right;color:#7a7a7a; ">换一家</span>
					<span id=" " class="form-control-feedback " style="vertical-align:middle;text-align:right;width:8%;margin-top:-1.3%;
				 "><img src="http://carowner.yonyouauto.com/fs01/ase/v1/images/GQ/jiant.png " style="display:inline-block; width:54%; "></span>
				</div></a>
			</div>
			<div class="form-group has-feedback list-group-item " style="vertical-align:middle; ">
				<!-- <label for="maintainType " class="col-sm-2 control-label ">顾问选择</label> -->
					<a id=" " class=" " href="# " onclick="gmcc.selectCounselor() ">
				<div class="col-sm-10 list-group-item-text ">
					<img src="http://carowner.yonyouauto.com/fs01/ase/v1/images/GQ/2.png " style="vertical-align:middle;width:7%; ">&nbsp;&nbsp;&nbsp;
					<span id="counselorName " style="vertical-align:middle;display:inline-block;width:60%;color:#7a7a7a; "></span>
					<span style="display:inline-block;vertical-align:middle;text-align:right;color:#7a7a7a; ">服务顾问</span>
					<span id=" " class="form-control-feedback " style="vertical-align:middle;text-align:right;margin-top:1.3%;width:8%;margin-top:-1.3%;
				 "><img src="http://carowner.yonyouauto.com/fs01/ase/v1/images/GQ/jiant.png " style="display:inline-block; width:54%; "></span>
				</div></a>
			</div>
		</div><div style="margin-left: 15px; margin-right: 15px; ">
		<button id="sure " type="button " class="btnbtn " onclick="gmcc.sure() " style="background:#3790f3 ">完成</button>
	</div>
</div>
	<!-- 定位当前城市经销商-经销商选择二级页面 -->
	<div id="nowDealerDiv " class="tab-pane fade hide-div ">
	<script>
		//距离近-距离远
		function near() {
			var aDiv = document.getElementsByTagName('li');
			var oUl = document.getElementById("dealerDiv ");
			var arr = [];
			for (var i = 0; i < aDiv.length; i++) {
				arr.push(aDiv[i]);  //aDiv是元素的集合，并不是数组，所以不能直接用数组的sort进行排序。
			}
			arr.sort(function (a, b) { return a.getAttribute('data-id') - b.getAttribute('data-id') });
			for (var i = 0; i < arr.length; i++) {
				oUl.appendChild(arr[i]); //将排好序的元素，重新塞到body里面显示。
			}
		}
		//距离远-距离近
		function far() {
			var aDiv = document.getElementsByTagName('li');
			var oUl = document.getElementById("dealerDiv ");
			var arr = [];
			for (var i = 0; i < aDiv.length; i++) {
				arr.push(aDiv[i]);  //aDiv是元素的集合，并不是数组，所以不能直接用数组的sort进行排序。
			}
			arr.sort(function (a, b) { return b.getAttribute('data-id') - a.getAttribute('data-id') });
			for (var i = 0; i < arr.length; i++) {
				oUl.appendChild(arr[i]); //将排好序的元素，重新塞到body里面显示。
			}
		}
	</script>
    	<img src="http://carowner.yonyouauto.com/fs01/ase/v1/images/GQ/d2.png " style="width:100%; " onclick="gmcc.selectMaintainDealer(this) " >
		<form class="filterform " action="# ">
		<div >
    	<br><input id="sou " class="filterinput form-control " type="text " placeholder="搜索 " style="width:80%;margin:0 auto;font-size:16px; ">
		</div>

<div class="dropdown ">
	<button type="button " class="btn dropdown-toggle " id="dropdownMenu1 "
			data-toggle="dropdown " style="background-color:#f6f6f6;font-size:16px; ">
		距离
		<span class="caret "></span>
	</button>
	<ul  style="text-align:center; " id="distance " class="dropdown-menu " role="menu " aria-labelledby="dropdownMenu1 ">

			<a role="presentation " tabindex="-1 " onclick="near() " style="font-size:16px; "><span>由近到远</span></a><br>
			<a role="presentation " tabindex="-1 " onclick="far() " style="font-size:16px; "><span>由远到近</span></a>

	</ul>
</div>

			<div id="searchDealer "></div>
		<ul id="list2 ">
		<li id="KmFirst " data-id="KmFirst ">
			<div class="panel panel-default ">
				<table style="width:100% " class="table-condensed "><tbody>
					<tr>
					<td style="width:160px;text-align:left; "><a onclick="gmcc.sureDealer(-1) ">
					<p id="nameFirst " style="font-family:黑体;font-size:16px;color:#000000 "></p>
					</a></td>
					<td style="width:100px;text-align:center;font-size:14px;color:#7a7a7a ">
					<span>距离：</span><span id="distanceFirst "></span>
					</td>
					</tr><tr>
					<td style="width:160px;text-align:left; ">
					<span id="addrFirst " style="font-faminly:宋体;font-size:15px;color:#615f5f "></span><br>
					<span id="remarkFirst " style="font-faminly:宋体;font-size:14px;color:#7a7a7a "></span>
					</td>
					<td style="width:100px;text-align:center;color:#7a7a7a ">
					<a href=" " id="Tel ">
					<span class="glyphicon glyphicon-earphone " style="color: rgb(255, 0, 23); font-size: 12px; "></span>
					<span style="font-family:宋体;font-size:14px;color:#7a7a7a "> 电话</span>
					</a></td>
					</tr>
				</tbody></table>
				<input id="codeFirst " class="hidden " value=" ">
			</div></li>

		<div id="dealerDiv " class=" ">
		</div>
		</ul>
	</div>
    <!-- 经销商选择-三级页面 -->
    <div id="maintainDealerDiv " class="tab-pane fade hide-div ">
    <img src="http://carowner.yonyouauto.com/fs01/ase/v1/images/GQ/d1.png " style="width:100%; ">
    <form class="filterform " action="# ">
    <div><br>
    <input id="cha " class="filterinput form-control " type="text " placeholder="搜索 " style="width:80%;margin:0 auto; ">
  </div>
  <div id="searchCity "></div>
    <div id="dealerMap " class="container ">
    <ul id="list1 ">
    <h3>A</h3><div id="A " style="background-color:#fff "></div>
    <h3>B</h3><div id="B " style="background-color:#fff "></div>
    <h3>C</h3><div id="C " style="background-color:#fff "></div>
    <h3>D</h3><div id="D " style="background-color:#fff "></div>
    <h3>E</h3><div id="E " style="background-color:#fff "></div>
    <h3>F</h3><div id="F " style="background-color:#fff "></div>
    <h3>G</h3><div id="G " style="background-color:#fff "></div>
    <h3>H</h3><div id="H " style="background-color:#fff "></div>
    <h3>I</h3><div id="I " style="background-color:#fff "></div>
    <h3>J</h3><div id="J " style="background-color:#fff "></div>
    <h3>K</h3><div id="K " style="background-color:#fff "></div>
    <h3>L</h3><div id="L " style="background-color:#fff "></div>
    <h3>M</h3><div id="M " style="background-color:#fff "></div>
    <h3>N</h3><div id="N " style="background-color:#fff "></div>
    <h3>O</h3><div id="O " style="background-color:#fff "></div>
    <h3>P</h3><div id="P " style="background-color:#fff "></div>
    <h3>Q</h3><div id="Q " style="background-color:#fff "></div>
    <h3>R</h3><div id="R " style="background-color:#fff "></div>
    <h3>S</h3><div id="S " style="background-color:#fff "></div>
    <h3>T</h3><div id="T " style="background-color:#fff "></div>
    <h3>U</h3><div id="U " style="background-color:#fff "></div>
    <h3>V</h3><div id="V " style="background-color:#fff "></div>
    <h3>W</h3><div id="W " style="background-color:#fff "></div>
    <h3>X</h3><div id="X " style="background-color:#fff "></div>
    <h3>Y</h3><div id="Y " style="background-color:#fff "></div>
    <h3>Z</h3><div id="Z " style="background-color:#fff "></div>
    </ul>
    </div>
    </div>
		<!-- 顾问模态框（Modal） -->
<div class="modal fade " id="counselorModal " tabindex="-1 " role="dialog " aria-labelledby="myModalLabel
				 " aria-hidden="true ">
	<div class="modal-dialog ">
		<div class="modal-content ">
		<div class="modal-body " style="text-align:left; ">
		<div name="seviceUser " id="seviceUser ">
		</div>
		<!-- <select name="seviceUser " id="seviceUser " class="form-control " placeholder=" "
						style="padding: 6px 40px " onchange="addCounseor() ">
					</select> -->
		</div>
		</div><!-- /.modal-content -->
		<button type="button " id="conselorBtn " class="close " data-dismiss="modal "
						aria-hidden="true ">
	</div><!-- /.modal-dialog -->
</div><!-- /.modal -->
</body>
</html>